<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="app">
        <input type="button" value="切换显示状态" @click="changeisshow" />
        <input type="button" value="增加年龄" @click="addage" />
        <input type="button" value="减小年龄" @click="minusage" />
        <h3>第二张图片大于18可以看，目前年龄年纪：{{age}}</h3>
        <br />
        <img v-show="isshow" src="1.jpeg" alt="这就是我" style="width: 600px; height:400px">
        <img v-show="age>=18" src="2.jpeg" alt="年满十八我要入党" style="width: 600px; height:400px">
    </div>
    <script src="https://unpkg.com/vue@next" ></script>
    <script>
    const app = {
        data() {
            return{
            isshow:false,
            age: 15,
            }
        },
        methods: {
            changeisshow: function() {
                this.isshow = !this.isshow;
            },
            addage: function() {
                this.age++;
            },
            minusage() {
                this.age--;
            },
        },
    };
    Vue.createApp(app).mount("#app");
</script>
</body>
</html>